import { BrowserRouter, NavLink, Navigate, Route, Routes } from "react-router-dom"
import Home from "./pages/Home/Home"
import About from "./pages/About/About"
import "./App.css"

const App=()=>{
  return (
    // 指定路由模式
    <BrowserRouter>

      <NavLink to={"/home"} className={({isActive})=>(isActive?"green":'')}>跳转到home页面</NavLink>
      <NavLink to={"/about"} className={({isActive})=>(isActive?"green":'')}>跳转到about页面</NavLink>

      <Routes>
        <Route path="/" element={<Navigate to={"/home"}></Navigate>}></Route>
        <Route path="/home" element={<Home></Home>}></Route>
        <Route path="/about" element={<About></About>}></Route>
      </Routes>
    </BrowserRouter>
  )
}

export default App